<template>
  <el-dialog
    :model-value="props.show"
    :close-on-click-modal="false"
    title="选择查询参数"
    width="450"
    center
    :key="props.show"
  >
    <el-select
      v-model="params.batchCode"
      clearable
      class="mySelect1 m-2"
      placeholder="请选择考试批次"
    >
      <el-option
        v-for="item in store.batchList"
        :key="item.code"
        :label="item.name"
        :value="item.code"
      />
    </el-select>
    <template v-if="props.type == 'renewPdf'">
      <el-select
        v-model="params.catalog"
        clearable
        class="mySelect1 m-2"
        placeholder="请选择类型"
      >
        <el-option
          v-for="item in typeList"
          :key="item.code"
          :label="item.name"
          :value="item.code"
        />
      </el-select>

      <el-input
        class="myInput"
        v-model="params.examNo"
        placeholder="请输入考号"
        clearable
      />
    </template>
    <template #footer>
      <span class="dialog-footer">
        <el-button type="primary" @click="handleConfirm">确 定</el-button>
        <el-button @click="handleCancel">取 消</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script setup>
import useBatchStore from '@/store/batchStore';
const store = useBatchStore();
const props = defineProps({
  show: {
    type: Boolean,
    default: false,
  },
  type: {
    type: String,
    default: '',
  },
});

const emits = defineEmits(['closeDia', 'renewFunc']);

// 类型列表
const typeList = ref([
  {
    name: '学生报告',
    code: '01',
  },
]);
const params = reactive({
  batchCode: '',
  catalog: '',
  examNo: '',
});

const handleCancel = () => {
  emits('closeDia');
};
const handleConfirm = () => {
  emits('renewFunc', params);
  params = {
    batchCode: '',
    catalog: '',
    examNo: '',
  };
};

watch(
  () => props.show,
  () => {
    params.batchCode = '';
    params.catalog = '';
    params.examNo = '';
  }
);
</script>

<style lang="scss" scoped></style>
